<template>
    <modal
        v-bind="modalProps"
        @confirm="confirm"
        @cancel="cancel"
        @done="$emit('done', lastRes)"
    >
        <div class="d-flex flex-column align-items-center align-items-stretch">
            <label class="d-flex infoTitle p-2 align-items-start my-2 mx-2">
                <span class="flex-shrink-0">主题： </span><input class="form-control" type="text" v-model="infoTitle">
            </label>
            <label class="d-flex infoContent p-2 align-items-start my-2 mx-2 flex-grow-1">
                <span class="flex-shrink-0">内容： </span>
                <textarea
                    class="form-control"
                    v-model="infoContent"
                    rows="4"
                ></textarea>
            </label>
        </div>
    </modal>
</template>

<script type="text/javascript">
import ajaxModal from '../plugin/ajaxModal'
import {defaultModal as modal} from '../plugin/ajaxModal'
import $ from 'jquery'

export default {
    name: 'confirm-modal',
    props: ['doc'],
    mixins: [ajaxModal],
    components: {modal},
    data() {
        return {
            doc_id: this.doc._id,
            infoContent: this.doc.info ? this.doc.info.content : '',
            infoTitle: this.doc.info ? this.doc.info.title : '' 
        }
    },
    computed: {
        preInfoTitle() {
            return this.doc.info ? this.doc.info.title : '';
        },
        preInfoContent() {
            return this.doc.info ? this.doc.info.content : '';  
        },
        preInfoId() {
            return this.doc.info ? this.doc.info._id : undefined;
        },
        isSendValid() {
            return !this.isLoading
            && this.infoTitle.length && this.infoContent.length
            && !(this.infoContent == this.preInfoContent && this.infoTitle == this.preInfoTitle);
        }
    },
    methods: {
        getParams() {
            var vm = this;
            return {
                _id: vm.doc_id,
                args: Object.assign({
                    info: {
                        _id: this.preInfoId,
                        title: this.infoTitle,
                        content: this.infoContent
                    }
                })
            }
        }
    }
}
</script>